<template>
	<view class="chongzhi-wrap">
		<web-view :src="src"></web-view>
		<!-- 登录提示 -->
		<shopro-auth-modal></shopro-auth-modal>
	</view>
</template>

<script>
	import { jsonp } from 'vue-jsonp'
	import md5Libs from "uview-ui/libs/function/md5";
	import { mapMutations, mapActions, mapState } from 'vuex';
	export default {
		data() {
			return {
				src: '',
				token: '',
				timer: null
			}
		},
		computed: {
			...mapState({
				userInfo: ({ user }) => user.userInfo,
				userData: ({ user }) => user.userData,
				isLogin: ({ user }) => user.isLogin,
				authType: ({ user }) => user.authType
			})
		},
		onLoad() {
			this.src = 'https://kfxt.xinshuangte.cn/client/v1/#/?u_id='
				+ this.userInfo.id + '&avatar=' + this.userInfo.avatar
				+ '&nickname=' + this.userInfo.nickname + '&real_name=' + this.userInfo.realname
				+ '&phone=' + this.userInfo.mobile
			this.getKefuToken()
		},
		methods: {
			getKefuToken() {
				let that = this
				let info = [that.userInfo.id, this.userInfo.nickname, this.userInfo.realname, this.userInfo.mobile]
				let signkey = md5Libs.md5(info.join('&')), count = 0
				that.timer = setInterval(function() {
					count++
					if (count > 10) {
						clearInterval(that.timer)
					}
					let url = 'https://kfxt.xinshuangte.cn/api/customer/get-token'
					let data = {
						uid: that.userInfo.id,
						signkey: signkey,
						callbackQuery: 'callback',
						callbackName: 'callback'
					}
					jsonp(url, data)
						.then(res => {
							if (res.code === 100) {
								that.token = res.data.token
								clearInterval(that.timer)
								that.pushData()
							}
						})
						.catch(error => {
							clearInterval(that.timer)
							console.log('kefu error', error)
						})
				}, 3000)
			},
			pushData() {
				let that = this
				let pushurl = 'https://kfxt.xinshuangte.cn/api/customer/push-info'
				// 推送订单和购买过
				that.$http('order.index', {type: 'all', per_page: 50}).then(res => {
					if (res.code === 1) {
						let orderinfos = []
						let buygoodsids = []
						let buygoodsinfos = []
						res.data.data.forEach((item, index) => {
							let infoitem = {
								id: item.id,
								order_sn: item.order_sn,
								amount: parseFloat(item.total_amount),
								payfee: parseFloat(item.pay_fee),
								status_name: item.status_name,
								created_at: item.created_at,
								goods: []
							}
							item.item.forEach((item1, index1) => {
								infoitem.goods.push({
									id: item1.goods_id,
									sku_text: item1.goods_sku_text,
									image: item1.goods_image,
									price: parseFloat(item1.goods_price),
									title: item1.goods_title,
									goods_number: item1.goods_num
								})
								if (buygoodsids.indexOf(item1.goods_id) === -1) {
									buygoodsids.push(item1.goods_id)
									buygoodsinfos.push({
										id: item1.goods_id,
										image: item1.goods_image,
										price: parseFloat(item1.goods_price),
										title: item1.goods_title,
										url: 'http://xyc.zmssp.cn/h5/#/pages/goods/detail?id=' + that.filterHuafeiGoods(parseInt(item1.goods_id))
									})
								}
							})
							orderinfos.push(infoitem)
						})
						uni.request({
							url: pushurl,
							method: 'POST',
							header: {Authorization: 'Bearer ' + that.token},
							data: {mode: 'order', infos: orderinfos}
						})
						uni.request({
							url: pushurl,
							method: 'POST',
							header: {Authorization: 'Bearer ' + that.token},
							data: {mode: 'bought_goods', infos: buygoodsinfos}
						})
					}
				})
				// 推送售后单
				that.$http('order.aftersaleList', {type: 'all', per_page: 50}).then(res => {
					if (res.code === 1) {
						let afterinfos = []
						res.data.data.forEach((item, index) => {
							let infoitem = {
								"id": item.id,
								"after_sn": item.aftersale_sn,
								"order_id": item.order_id,
								"goods_image": item.goods_image,
								"goods_price": parseFloat(item.goods_price),
								"goods_title": item.goods_title,
								"goods_sku_text": item.goods_sku_text,
								"status_text": item.refund_status_text,
								"created_at": item.created_at
							}
							afterinfos.push(infoitem)
						})
						uni.request({
							url: pushurl,
							method: 'POST',
							header: {Authorization: 'Bearer ' + that.token},
							data: {mode: 'order_after', infos: afterinfos}
						})
					}
				})
				// 推送浏览过
				that.$http('user.viewList', {per_page: 100}).then(res => {
					if (res.code === 1) {
						let goodsinfos = []
						res.data.data.forEach((item, index) => {
							let infoitem = {
								"id": item.id,
								"image": item.goods.image,
								"price": parseFloat(item.goods.price),
								"title": item.goods.title,
								"url": 'http://xyc.zmssp.cn/h5/#/pages/goods/detail?id=' + that.filterHuafeiGoods(parseInt(item.id))
							}
							goodsinfos.push(infoitem)
						})
						uni.request({
							url: pushurl,
							method: 'POST',
							header: {Authorization: 'Bearer ' + that.token},
							data: {mode: 'goods', infos: goodsinfos}
						})
					}
				})
				// 推送收藏
				that.$http('user.favoriteList', {per_page: 100}).then(res => {
					if (res.code === 1) {
						let favoriteinfos = []
						res.data.data.forEach((item, index) => {
							let infoitem = {
								"id": item.id,
								"image": item.goods.image,
								"price": parseFloat(item.goods.price),
								"title": item.goods.title,
								"url": 'http://xyc.zmssp.cn/h5/#/pages/goods/detail?id=' + that.filterHuafeiGoods(parseInt(item.id))
							}
							favoriteinfos.push(infoitem)
						})
						uni.request({
							url: pushurl,
							method: 'POST',
							header: {Authorization: 'Bearer ' + that.token},
							data: {mode: 'favorite_goods', infos: favoriteinfos}
						})
					}
				})
			},
			filterHuafeiGoods(goods_id) {
				if (goods_id === 771 || goods_id === 772) {
					return 0
				}
				return goods_id
			}
		}
	}
</script>

<style lang="scss">
	
	.chongzhi-wrap{padding:20rpx;}
	
	.title-money{font-size:24rpx;color:#999;padding:20rpx 10rpx;}
	
	.chongzhi-tips{
		padding:20rpx;
		.title{
			font-weight:bold;
			padding:20rpx 0;
			line-height:200%;
			font-size:28rpx;
			color:#666;
			margin-top:30rpx;
			}
		.content{
			line-height:180%;
			margin:10rpx 0;
			font-size:24rpx;
			color:#999
			}
	}
	
	
	.money-list{
		display:flex;
		justify-content: space-between;
		align-items: center;
		
		.money-box{
			padding:20rpx;
			border:1rpx solid #0dc323;
			color:#0dc323;
			border-radius:10rpx;
			width:100%;
			margin:10rpx;
			text-align: center;
			font-size:28rpx;
		}
	}
	
	.chongzhi-card {
		background-color: #fff;
		border-radius: 10rpx;
		padding: 30rpx;
		
	
		.card-title {
			font-size: 30rpx;
			font-weight: 500;
			color: #333333;
		}
	
		.input-box {
			width: 624rpx;
			border-bottom: 1rpx solid #eee;
			height: 100rpx;
	
			.unit {
				font-size: 48rpx;
				color: #333;
			}
		}
	
		.bank-box {
			.name {
				font-size: 28rpx;
				font-weight: 500;
				color: #333333;
			}
	
			.bank-list {
				.empty-text {
					font-size: 28rpx;
					font-weight: 400;
					color: #999999;
				}
	
				.sel-box {
					.item-img {
						width: 36rpx;
						height: 36rpx;
					}
	
					.item-title {
						font-size: 28rpx;
						color: #333333;
					}
				}
			}
		}
	
		.bank-info {
			height: 50rpx;
			font-size: 28rpx;
			font-weight: 400;
			color: #999999;
	
			.bank-info-title {
				width: 500rpx;
			}
	
			.bind-btn {
				padding: 0 20rpx;
				line-height: 50rpx;
				background: #f5f6f8;
				border-radius: 20rpx;
				color: #999;
			}
		}
	
		.save-btn {
			width: 616rpx;
			height: 86rpx;
			line-height: 86rpx;
			background: linear-gradient(-90deg, #a36fff, #5336ff);
			box-shadow: 0px 7rpx 11rpx 2rpx rgba(124, 103, 214, 0.34);
			border-radius: 43rpx;
			font-size: 30rpx;
			font-weight: 500;
			color: #ffffff;
		}
	}
	
	// 提现说明
	.draw-notice {
		width: 684rpx;
		height: 327rpx;
		background: #ffffff;
		border-radius: 20rpx;
		padding: 30rpx 35rpx;
		margin: 20rpx auto;
	
		.title {
			font-size: 30rpx;
			font-weight: 500;
			color: #333333;
			margin-bottom: 30rpx;
		}
	
		.draw-list {
			font-size: 24rpx;
			font-weight: 400;
			color: #999999;
			margin-bottom: 10rpx;
		}
	}
	

</style>
